<!--
  ~ Copyright (c) 2024, Oracle and/or its affiliates.
  ~
  ~   This software is dual-licensed to you under the Universal Permissive License
  ~   (UPL) 1.0 as shown at https://oss.oracle.com/licenses/upl or Apache License
  ~   2.0 as shown at http://www.apache.org/licenses/LICENSE-2.0. You may choose
  ~   either license.
  ~
  ~   Licensed under the Apache License, Version 2.0 (the "License");
  ~   you may not use this file except in compliance with the License.
  ~   You may obtain a copy of the License at
  ~
  ~      https://www.apache.org/licenses/LICENSE-2.0
  ~
  ~   Unless required by applicable law or agreed to in writing, software
  ~   distributed under the License is distributed on an "AS IS" BASIS,
  ~   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~   See the License for the specific language governing permissions and
  ~   limitations under the License.
  ~
  ~
  -->

<!DOCTYPE html>
<html lang="en">


<h3 th:text="${#lists.size(employees)} > 0? 'Employees List': 'No employee selected'"></h3>
<ul th:each="employee:${employees}" th:object="${employee}"
    class="list-group list-group-flush">
    <li class="list-group-item p-2">
        <div class="container border-bottom border-1">
            <div class="row">
                <div class="col">
                    <span class="fw-bold" th:text="*{fullName}"
                          th:classappend="*{visible} ? '' : 'fst-italic'"/>
                    <span th:unless="*{visible}"
                          class="badge position-absolute top-0 start-100 translate-middle rounded-pill text-bg-danger">
                                Should be Hidden
                            </span>
                </div>
            </div>
            <div class="row">
                <div class="col">

                </div>
                <div class="col">
                    <span class="fw-lighter">Employee Id</span>
                    <span class="font-monospace" th:text="*{id}"/>
                </div>
            </div>
        </div>
    </li>
</ul>

</html>
